$body_max_width: 1140px; //内容最大宽度
$body_bg_color: #fff; //页面背景色

$theme_color: #ff5500; //主题色
$border_color: #e6e6e6; //边框色
//怪癖模式
*{
  box-sizing: border-box;
  &:before,&:after{
    box-sizing: border-box;
  }
}
//只允许一行
.text_oneline{
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
//多行显示自动截取
@mixin text_moreline($count){
  height: auto;
  line-height: 1.5em;
  display: -webkit-box;
  -webkit-line-clamp: $count;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
//改行内元素为盒装内联元素
.dp_ib{
  display: inline-block;
}
//背景色
.body_bg_color{
  background: $body_bg_color;
}
//字体色
.text_theme{
  color: $theme_color;
}
a.text_theme{
  &:hover,
  &:focus{
    color: darken($theme_color,10%);
  }
}
.text_gray{
  color: #999999;
}
.text_darkgray{
  color: #808080;
}
.text_black{
  color: #333;
}
//字体相关
.f12{
  font-size: 12px !important;
}
.f14{
  font-size: 14px !important;
}
.f16{
  font-size: 16px !important;
}
.f18{
  font-size: 18px !important;
}
.f22{
  font-size: 22px !important;
}
.f28{
  font-size: 28px !important;
}
.f32{
   font-size: 32px !important;
 }

.fwb{
  font-weight: bold;
}
.ft_num{
  font-family: Arial;
}
/*定位相关*/
.pt_rl{
  position: relative;
}
//内边距
.p0{
  padding: 0;
}
.p2{
  padding: 1px;
}
.p10{
  padding: 10px;
}
.p15{
  padding: 15px;
}
.pr0{
  padding-right: 0;
}
.pl0{
  padding-left: 0;
}
.p1r15{
  padding: 0 15px;
}
.p-tb-xs{
  padding-top: 5px;
  padding-bottom: 5px;
}
.p-tb{
  padding-top: 10px;
  padding-bottom: 10px;
}
.p-t{
  padding-top: 10px !important;
}
.p-t-md{
  padding-top: 15px !important;
}
.p-t-lg{
  padding-top: 20px !important;
}
.p-b{
  padding-bottom: 10px !important;
}
.p-b-lg{
  padding-bottom: 20px !important;
}
.p-t-xs{
  padding-top: 5px;
}
.p-r-xs{
  padding-right: 5px;
}
.p-r{
  padding-right: 10px;
}
.p-r-md{
  padding-right: 15px;
}
.p-l-xs{
  padding-left: 5px;
}
.p-l{
  padding-left: 10px;
}
.p-l-md{
  padding-left: 15px;
}
//外边距
.m0{
  margin: 0 !important;
}
.m-t-xs{
  margin-top: 5px ;
}
.m-t{
  margin-top: 12px ;
}
.m-t-md{
  margin-top: 15px ;
}
.m-t-lg{
  margin-top: 20px;
}
.m-b{
  margin-bottom: 12px ;
}
.m-b-xs{
  margin-bottom: 5px;
}
.m-r-xs{
  margin-right: 5px ;
}
.m-r{
  margin-right: 12px ;
}
.m-l{
  margin-left: 12px ;
}
.m-l-xs{
  margin-left: 5px ;
}
.m-l-md{
  margin-left: 15px ;
}
.lh25{
  line-height: 25px;
}
.vat{
  vertical-align: top;
}
.w{
  width: 100%;
}
//边框
.bbs{
  border-bottom: 1px solid $border_color;
}
.border-s{
  border: 1px solid $border_color;
}
//最大宽度限定
.max_body{
  width: 100%;
  max-width: $body_max_width;
  margin: 0 auto;
}
//自动水平居中
.auto_center{
  width: auto;
  display: table;
  margin: 0 auto;
}
//左边文字，右边按钮，宽度不够后文字自动截取
.intercept_btn_xs{
  @extend .clearfix;
  .pull-left{
    width: calc(100% - 55px);
    @extend .text_oneline;
  }
}
//左边文字，右边日期，宽度不够后文字自动截取
.intercept_date{
  @extend .clearfix;
  .pull-left{
    width: calc(100% - 65px);
    @extend .text_oneline;
  }
}
//重置boostrasp媒体组件在宽度不足情况下会被遮盖不自动换行问题
.media{
  .media-left{
    display: inherit;
    float: left;
  }
  .media-body{
    display: inherit;
    width: auto;
  }
}
//小方块
.square{
  width: 4px;
  height: 4px;
  display: inline-block;
  vertical-align: middle;
  background: #cecece;
  margin-right: 5px;
}
//搜索输入框图标组
.search_group{
  display: inline-block;
  position: relative;
  input{
    line-height: 1.8em;
    border: 1px solid $border_color;
    padding-left: 5px;
  }
  i{
    position: absolute;
    right: 5px;
    color: #999;
    top: 17px;
  }
}

//图片动画效果
.pictures{
  overflow: hidden;
  .picture{
    cursor: pointer;
    transition: all 0.5s ease 0s;
    &:hover{
      transform: scale(1.15) rotate(-1.5deg);
    }
  }
}
//重置bootstrap分页颜色
.pagination{
  li{
    a,span{
      color: #333333;
    }
  }
  .active{
    a,span{
      background-color: $theme_color;
      border-color: $theme_color;
      &:hover{
        background-color: $theme_color;
        border-color: $theme_color;
      }
    }
  }
}
//图片轮播
.img_carousel{
  position: relative;
  .img_title{
    position: absolute;
    left: 0;
    bottom: 0;
    background: rgba(0,0,0,.4);
    width: 100%;
    padding: 6px 0 4px 0;
    .pull-left{
      padding-left: 5px;
      width: calc(100% - 50px);
      a{
        color: #ffffff;
        width: 100%;
        display: inline-block;
        @extend .text_oneline;
      }
    }
    .pull-right{
      padding-right: 5px;
      li{
        padding: 0;
        a{
          color: #bfbfbf;
          display: inline-block;
          line-height: 20px;
        }
      }
      .active{
        a{
          color: $theme_color;
        }
      }
    }
  }
}